<template>
	<view class="message" style="min-height: 100vh;background: #fff;">
		<view class='list' :class="{read: item.noticeStatus}" v-for="(item, index) in list" :key="index" @click="messageDetail(item)">
			<view class="content">
				<img :src="icon1" v-if="item.noticeFrom == '0'" />
				<img :src="icon2" v-else />
				<text class="msg">{{item.noticeTitle}}</text>
				<text class="dot" v-if="!item.noticeStatus"></text>
			</view>
			<view class="listCont" v-if="item.noticeType != '13'" v-html="item.noticeContent || ''">
			</view>
			<view class="date">{{item.updateTime.slice(0, 16)}}</view>
		</view>
		<mix-load-more :status="loading"></mix-load-more>
	</view>
</template>

<script>
import { mapState } from 'vuex';
import http from '@/common/request.js';
import { getCommonShareInfo } from '@/common/utils.js';
import mixLoadMore from '@/components/mix-load-more/mix-load-more';
export default {
	components: {
		mixLoadMore
	},
	data() {
		return {
			icon1: '//mall-rongchuang.oss-cn-beijing.aliyuncs.com/guixin_miniProgram/img/jubao.png',
			icon2: '//mall-rongchuang.oss-cn-beijing.aliyuncs.com/guixin_miniProgram/img/laba.png',
			list: [],
			pageNum: 1,
			pageSize: 15,
			loading: 0,
			medalTaskActionId: '',
			memberId: '',
			ifOnShow:false
		};
	},
	onReachBottom() {
		//当划到最底部的时候触发事件
		if (this.loading != 2) {
			this.mesList();
		}
	},
	onShow() {
		// this.tabChange();
	},
	computed: {
		...mapState({ userInfo: state => state.userInfo })
	},
	mounted() {
		this.tabChange();
	},
	methods: {
		tabChange(index) {
			this.reset();
			this.mesList();
		},
		reset() {
			//重置查询第一页
			this.pageNum = 1;
			uni.pageScrollTo({
				scrollTop: 0,
				duration: 300
			});
			this.list = [];
		},
		mesList(tag) {
			this.loading = 1;
			
			http('/api/cusMessageNotice/pageList', { method: 'POST', data: { pageNum: this.pageNum, pageSize: this.pageSize } }).then(result => {
				if (result.code == '200') {
					const rows = result.rows || [];
					this.list = this.list.concat(rows); //进行数据的累加
					if (rows.length === this.pageSize) {
						this.pageNum++; //页数的++
						this.loading = 0;
					} else {
						this.loading = 2;
					}
					this.loading = this.list.length === 0 ? 3 : this.loading;
				}
			});
		},
		
		messageDetail(data) {
			http('/api/cusMessageNotice/readMessageNptice', { method: 'POST', data: { messageNoticeId: data.messageNoticeId} }).then(result => {
				if (result.code == '200') {
					data.noticeStatus = 1
					let status = data.noticeType
					let url = ''
					switch (status){
					    case 1:
						case 9:
						case 11:
						case 14:
							this.jumpTo('../activity/info/index?activityId=' + data.contentId)
							break
					    case 2:
							this.jumpTo('/personal/diray')
							break
						case 13:
							this.jumpTo('/personal/msgDetail?id=' + data.messageNoticeId)
							break
						case 3:
						case 4:
						case 10:
						case 12:
						case 16:
							this.jumpTo(url = '../card/takeCard?id=' + data.contentId)
							break
					    case 6:
						case 7:
							this.jumpTo('/personal/person')
							break
						case 8:
							this.jumpTo('../interaction/diary/info/index?cusDiaryId=' + data.contentId)
							break
						case 15:
							this.jumpTo('../home/web_view?url=' + encodeURIComponent(data.contentId))
							break
						case 17:
							this.jumpTo('../home/returnStory/details?contentId=' + data.contentId)
							break
						case 18:
							this.jumpTo('../home/returnHome/swiperDetails?recruitPartnerId=' + data.contentId)
							break
						case 19:
							this.jumpTo('/personal/myChart?isActive=' + '1')
							break;
						case 20:
							this.jumpTo('/personal/messageDetail?time=' + data.contentId)
							break;
					}
				}
			});
				
		},
		jumpTo(url) {
			uni.navigateTo({
				url: url,
				animationType: 'pop-in',
				animationDuration: 200
			});
		},
		updatTodo(medalTaskActionId) {
			http('/api/sysMedalTask/todoTask?medalTaskActionId=' + medalTaskActionId, { method: 'POST' }).then(result => {
				if (result.data.length > 0) {
				}
			});
		},
		dotClick(url) {
			url = url + '&memberId=' + this.memberId;
			// 调用记数
			// this.updatTodo(this.medalTaskActionId)
			uni.navigateTo({
				url: 'webView?url=' + encodeURIComponent(url),
				animationType: 'pop-in',
				animationDuration: 200
			});
		}
	}
};
</script>

<style lang="less" scoped>
.message {
	.list {
		margin: 0rpx 28rpx;
		padding-top: 30rpx;
		border-bottom: 2rpx solid rgba(102, 100, 93, 0.08);
		color: #66645D;
		.listCont {
			font-size: 28rpx;
			line-height: 40rpx;
			margin-left: 48rpx;
			margin-top: 20rpx;
			word-wrap: break-word;
			white-space: normal;
			word-break: break-all;
		}
		.content {
			display: flex;
			align-items: center;
			img {
				width: 30rpx;
				height: 30rpx;
				margin-right: 20rpx;
			}
			.msg {
				font-size: 30rpx;
				flex: 1;
			}
			.dot {
				width: 12rpx;
				height: 12rpx;
				background: #F39800;
				border-radius: 100%;
			}
		}
		.date {
			font-size: 24rpx;
			color: rgba(102, 100, 93, 0.5);
			margin: 20rpx 0 32rpx 0;
			text-align: right;
		}
	}
	.read {
		color: rgba(102, 100, 93, 0.5);
	}
}
</style>
